<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>首页</title>
		<!-- import CSS -->
		<link href="https://cdn.bootcdn.net/ajax/libs/element-ui/2.13.2/theme-chalk/index.css" rel="stylesheet">
		<script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script>
		<!-- import Vue before Element -->
		<script src="/html/vue.js"></script>
		<!-- import JavaScript -->
		<script src="https://cdn.bootcdn.net/ajax/libs/element-ui/2.13.2/index.js"></script>
		<script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script>
		<script type="text/javascript" src="/html/wangEditor.min.js"></script>
	</head>
	<body>
		<div id="app" style='width: 100%; height: 100%;'>
			<el-container style="height: 100%; border: 1px solid #eee">
				<el-aside width="200px">
					<el-menu :default-openeds="['1', '3']">
						<el-submenu index="1">
							<template slot="title"><i class="el-icon-message"></i>文章</template>
							<el-menu-item-group>
								<template slot="title">分组一</template>
								<!-- <el-menu-item index="1-1" class="el-menu-item is-active"><el-link href="#">文章管理</el-link></el-menu-item> -->
								<el-link href="/index.php/admin_to/admin">
									<el-menu-item index="1-1">文章管理</el-menu-item>
								</el-link>
								<el-link href="/index.php/admin_to/write_news" target="_blank" :underline="false">
									<el-menu-item index="1-2">文章编写</el-menu-item>
								</el-link>
							</el-menu-item-group>
							<el-menu-item-group title="分组2">
								<el-link href="/index.php/admin_to/modify">
									<el-menu-item index="1-3">文章修改</el-menu-item>
								</el-link>
								<el-link href="#">
									<el-menu-item index="1-4" class="el-menu-item is-active">文章查看</el-menu-item>
								</el-link>
							</el-menu-item-group>
							<el-submenu index="1-4">
								<template slot="title">分类</template>
								<el-link href="/index.php/admin_to/classification">
									<el-menu-item index="1-4-1">文章分类</el-menu-item>
								</el-link>
							</el-submenu>
						</el-submenu>
						<el-submenu index="2">
							<template slot="title"><i class="el-icon-menu"></i>资源</template>
							<el-menu-item-group>
								<template slot="title">分组一</template>
								<el-link href="/index.php/admin_to/video_material">
									<el-menu-item index="2-1">视频管理</el-menu-item>
								</el-link>
								<el-menu-item index="2-2">选项2</el-menu-item>
							</el-menu-item-group>
							<el-menu-item-group title="分组2">
								<el-menu-item index="2-3">选项3</el-menu-item>
							</el-menu-item-group>
							<el-submenu index="2-4">
								<template slot="title">选项4</template>
								<el-menu-item index="2-4-1">选项4-1</el-menu-item>
							</el-submenu>
						</el-submenu>
						<el-submenu index="3">
							<template slot="title"><i class="el-icon-setting"></i>导航三</template>
							<el-menu-item-group>
								<template slot="title">分组一</template>
								<el-link href="/index.php/admin_to/teacher_list">
									<el-menu-item index="3-1">老师信息列表</el-menu-item>
								</el-link>
								<el-link href="#">
									<el-menu-item index="3-2">信息操作层</el-menu-item>
								</el-link>
							</el-menu-item-group>
							<el-menu-item-group title="分组2">
								<el-link href="/index.php/admin_to/course_list">
									<el-menu-item index="3-3">课程信息列表</el-menu-item>
								</el-link>
								<el-menu-item index="3-4">信息操作层</el-menu-item>
							</el-menu-item-group>
							<el-menu-item-group title="分组3">
								<el-link href="/index.php/admin_to/equipment_list">
									<el-menu-item index="3-5">设备信息列表</el-menu-item>
								</el-link>
								<el-menu-item index="3-6">信息操作层</el-menu-item>
							</el-menu-item-group>
							<el-submenu index="3-7">
								<template slot="title">选项4</template>
								<el-menu-item index="3-7-1">选项4-1</el-menu-item>
							</el-submenu>
						</el-submenu>
					</el-menu>
				</el-aside>

				<el-container>
					<el-header style="text-align: right; font-size: 12px">
						<el-dropdown @command="user_list">
							<i class="el-icon-setting" style="margin-right: 15px"></i>
							<el-dropdown-menu slot="dropdown">
								<el-dropdown-item command="a">查看</el-dropdown-item>
								<el-dropdown-item command="b">新增</el-dropdown-item>
								<el-dropdown-item command="c">退出登录</el-dropdown-item>
							</el-dropdown-menu>
						</el-dropdown>
						<span>{{ name }}</span>
					</el-header>
					<el-main>
						<el-row>
							<el-col :span="6"> </el-col>
							<el-col :span="6">文章标题：</el-col>
							<el-col :span="6">
								<el-input v-model="title" placeholder="请输入内容" :disabled="true"></el-input>
							</el-col>
							<el-col :span="6"> </el-col>
						</el-row>
						<el-row style='margin-top: 10px;'>
							<el-col :span="6"> </el-col>
							<el-col :span="6">文章分类：</el-col>
							<el-col :span="6">
								<div>
									<!-- <el-radio v-model="category" label="1" :disabled="true">栏目A</el-radio>
									<el-radio v-model="category" label="2" :disabled="true">栏目B</el-radio>
									<el-radio v-model="category" label="3" :disabled="true">栏目C</el-radio> -->
									<!-- <el-radio v-for="item in category_arrs" v-model="category" :label="item.id">{{ item.name }}</el-radio> -->
									<el-select v-model="category" placeholder="请选择" disabled>
										<el-option v-for="item in category_arrs" :key="item.id" :label="item.name" :value="item.id">
										</el-option>
									</el-select>
								</div>
							</el-col>
							<el-col :span="6"> </el-col>
						</el-row>
						<el-row style='margin-top: 20px;'>
							<el-col :span="6"></el-col>
							<el-col :span="6">文章简介：</el-col>
							<el-col :span="6">
								<el-input type="textarea" placeholder="请输入内容" v-model="introduction" maxlength="30" show-word-limit :disabled="true">
								</el-input>
							</el-col>
							<el-col :span="6"></el-col>
						</el-row>
						<el-row style='margin-top: 30px;'>
							<el-col :span="6"></el-col>
							<el-col :span="6">发布日期：</el-col>
							<el-col :span="6">
								<el-date-picker v-model="time" type="date" placeholder="选择日期" :disabled="true" value-format="yyyy-MM-dd">
								</el-date-picker>
							</el-col>
							<el-col :span="6"></el-col>
						</el-row>
						<el-row style='margin-top: 30px;'>
							<el-col :span="6">新闻标题图片：</el-col>
							<el-col :span="6">
								<el-upload class="avatar-uploader" action="" :show-file-list="false" :on-success="handleAvatarSuccess"
								 :before-upload="beforeAvatarUpload">
									<img v-if="title_url" :src="title_url" class="avatar">
									<i v-else class="el-icon-plus avatar-uploader-icon"></i>
								</el-upload>
							</el-col>
							<el-col :span="6">
							</el-col>
							<el-col :span="6"></el-col>
						</el-row>
						<el-row style='margin-top: 30px;'>
							<el-col :span="24">文章内容</el-col>
						</el-row>
						<el-row style='margin-top: 30px;'>
							<el-col :span="24">
								<div id="editor">
									<p>欢迎使用 <b>Editor</b> 富文本编辑器</p>
								</div>
							</el-col>
						</el-row>
					</el-main>

				</el-container>
			</el-container>
		</div>
		<script type="text/javascript">
			var E = window.wangEditor
			var editor = new E('#editor')
			// 或者 var editor = new E( document.getElementById('editor') )
			editor.customConfig.withCredentials = true
			editor.customConfig.uploadFileName = 'file'
			editor.create()
		</script>
		<script>
			new Vue({
				el: '#app',
				data: function() {
					return {
						page: 1,
						limit: 10,
						like: "", //标题
						category: "", //文章类别
						tableData: [],
						name: "admin",
						conunt: 1000,
						category_arrs: [{
							value: '1',
							label: '栏目A11'
						}, {
							value: '2',
							label: '栏目B22'
						}, {
							value: '3',
							label: '栏目C33'
						}]
					}
				},
				methods: {
					handleClick(row) {
						//console.log(row);
					},
					edit(scope) {
						//console.log(scope);
					},
					handleCurrentChange(val) {
						var me = this;
						//console.log(val);
					},
					inquire() {

					},
					user_list(command) {
						if (command == "c") {
							axios.get('/index.php/server/login/ex_login', {
									params: {}
								})
								.then(function(response) {
									//console.log(response);							
									window.location.href = "/index.php/server/login/go";
									return
								})
								.catch(function(error) { // 请求失败处理
									//console.log(error);
								});

						}
						//console.log(command);
						var username = sessionStorage.getItem("name");
						if (username != 'admin') {
							this.$message({
								message: '只有admin账户拥有此权限！',
								type: 'warning'
							});
							return;
						}
						window.location.href = "/index.php/admin_to/user_list";
					}
				},
				mounted: function() {

				},
				/* 在实例创建完成后被立即调用。
				在这一步，实例已完成以下的配置：数据观测 (data observer)，属性和方法的运算，watch/event 事件回调。
				然而，挂载阶段还没开始，$el 属性目前不可见。 */
				created: function() {
					var me = this;
					//console.log('created');
					axios.get('/index.php/server/classification/select', {
							params: {
								page: 1,
								limit: 1000
							}
						})
						.then(function(response) {
							//console.log(response);
							me.category_arrs = response.data;
						})
						.catch(function(error) { // 请求失败处理
							//console.log(error);
						});

					me.id = sessionStorage.getItem("id");
					me.title = sessionStorage.getItem("title");
					me.title_url = sessionStorage.getItem("title_url");
					me.introduction = sessionStorage.getItem("introduction");
					me.time = sessionStorage.getItem("time");
					me.content = sessionStorage.getItem("content");
					me.category = sessionStorage.getItem("category");
					editor.txt.html(sessionStorage.getItem("content")); //写入富文本内容
					me.name = sessionStorage.getItem("name");
				}
			})
		</script>
		<style>
			.el-header {
				background-color: #D9ECFF;
				color: #303133;
				line-height: 60px;
			}
		</style>
	</body>
</html>
